import axios from 'axios'
import store from '../store'

/**
 * 创建 axios 实例
 */
const service = axios.create({
  baseURL: '', // 基准url
  timeout: 30000, // 超时时间
})

/**
 * 请求拦截
 */
service.interceptors.request.use(
  (config) => {
    // 在发送请求之前做些什么
    // 通常在请求拦截中，在请求头中统一传递 token 数据到服务端
    // TODO.......
    const token = store.getters.token
    if (token) {
      config.headers.Authorization = 'Bearer ' + token
    }

    // 可以在请求拦截时，显示数据加载提示的 Loading 框
    // TODO.......
    return config
  },
  (error) => {
    // 对请求错误做些什么
    return Promise.reject(error)
  }
)

/**
 * 响应拦截
 */
service.interceptors.response.use(
  (response) => {
    // 2xx 范围内的状态码都会触发该函数
    // 对响应数据做点什么

    // response.status 是服务器HTTP响应状态码
    if (response.status === 200) {
      // response.data 中保存的是真正后端向前端返回的数据
      // 通常后端向前端返回一个 JSON 格式的对象，是有前后
      // 端交互规范，比如后端返回: {code, data, message}

      // 在当前项目后端返回的数据中，code 为 200 则 data 中
      // 是前端需要使用到的数据内容，如果code 不为 200，则
      // data 中没有相关数据，在 message 中有相关错误消息
      const { code, data, message } = response.data
      if (code === 200) {
        return data
      }

      // 返回 400 则说明 token 有问题
      if (code === 400) {
        // 重置用户登录的状态数据
        store.commit('reset')
        // 跳转到登录页面重新登录
        window.location.href = '/login'
      }

      const error = new Error(message)
      return Promise.reject(error)
    }

    // 如果 HTTP 状态码不为 200，则将 Promise 状态切换为 rejected 状态
    const err = new Error('网络请求异常...')
    return Promise.reject(err)
  },
  (error) => {
    // 超出 2xx 范围的状态码都会触发该函数。
    // 对响应错误做点什么
    return Promise.reject(error)
  }
)

export default service
